<template>
    <div class="header2">
        <div class=" ">
            <el-menu
                    :default-active="activeIndex2"
                    class="el-menu-demo "
                    mode="horizontal"
                    background-color="#545c64"
                    text-color="#fff"
                    active-text-color="#fff">
                <el-menu-item index="1">
                    <router-link to="/" target="blank">导航</router-link>
                </el-menu-item>
                <el-menu-item index="2">
                    <router-link to="/" target="blank">首页</router-link>
                </el-menu-item>
                <el-menu-item index="3">
                    <router-link to="/free" target="blank">免费</router-link>
                </el-menu-item>
                <el-menu-item index="4">
                    <router-link to="/" target="blank">玄幻奇幻</router-link>
                </el-menu-item>
                <el-menu-item index="5">
                    <router-link to="/" target="blank">仙侠武侠</router-link>
                </el-menu-item>
                <el-menu-item index="6">
                    <router-link to="/" target="blank">都市小说</router-link>
                </el-menu-item>
                <el-menu-item index="7">
                    <router-link to="/" target="blank">悬疑推理</router-link>
                </el-menu-item>
                <el-menu-item index="8" @click="verify_vip">
                    <a>vip专区</a>
                </el-menu-item>
                <el-menu-item index="9">
                    <router-link to="/" target="blank">澳门赌场</router-link>
                </el-menu-item>
                <el-menu-item index="10" @click="beautyLicensing">
                    <a>美女发牌</a>
                </el-menu-item>
                <el-menu-item index="11" @click="verify_login" v-show="is_show">
                    <a>个人中心</a>
                </el-menu-item>
            </el-menu>
        </div>
    </div>

</template>

<script>
    export default {
        name: "Header2",
        data() {
            return {
                activeIndex: '1',
                activeIndex2: '1',
                is_show: true,
            };
        },
        methods: {
            // 校验用户登录点击个人中心是否登录
            verify_login() {
                let token = this.$cookies.get('token');
                // console.log('token:', token);
                if (!token) {
                    this.$router.push('/login');
                    return false
                }
                this.$router.push('/info');
            },
            // 校验VIP
            verify_vip() {
                let token = this.$cookies.get('token');
                if (!token) {
                    this.$router.push('/login');
                }
                let is_vip = this.$cookies.get('user_dict').is_vip;
                if (!is_vip) {
                    this.$message({
                        message: "对不起, 您不是VIP用户您无法访问!",
                        type: 'warning',
                    });
                    return false;
                }
                this.$router.push('/vipbook');
            },
            // 美女发牌
            beautyLicensing() {
                location.href = "https://www.mzitu.com/";
            }
        }
    }
</script>

<style scoped>
    .el-menu-demo li{
        width: 103px;
        /*padding: 0 26px;*/
    }
    .el-menu-demo li:last-child {
        /*width: 110px;*/
    }
    .el-menu-item a {
        display: block;
    }
</style>